<!DOCTYPE html>
<html>
    <head>
        <style>
            #box{
                width:200px;
                height:200px;
                background-color: yellow;
                display:flex;/*将当前元素设置为弹性布局*/
            }
            #box div{
                width:50px;
                height:50px;
                background-color: blue;
                color:white;
                font-size:20px;
            }
            #box1{
                width:200px;
                height:200px;
                background-color: yellow;
                
            }
            #box1 div{
                width:50px;
                height:50px;
                background-color: blue;
                color:white;
                font-size:20px;
            }
        </style>
    </head>

    <body>
        <div id="box">
            <div class="item1">1</div>
            <div class="item2">2</div>
            <div class="item3">3</div>
            <div class="item4">4</div>
        </div>
        <br/><br/>
        <div id="box1">
            <div class="item1">1</div>
            <div class="item2">2</div>
            <div class="item3">3</div>
            <div class="item4">4</div>
        </div>
    </body>
</html>